<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<script src="https://unpkg.com/react@17/umd/react.development.js" crossorigin></script>
		<script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"
			crossorigin></script>
		<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
		<title>model</title>
	</head>
	<body>
		<div id="root"></div>
		<!-- 
			防止 XSS 攻击的方法
				使用 document.createTextNode('hello world') 插入文本节点。
				或者使用 textContent 而不是 innerHTML 设置文本内容。
				对于一些特殊字符，比如 <、>，我们可以进行转义，将其转换为 &#60; 以及 &#62;
				对于富文本内容，我们可以设置黑名单，过滤一些属性，比如 onerror 等。

			React 使用 createTextNode 或者 textContent 设置文本内容
		 -->
		<script type="text/babel">
            class Weather extends React.Component {
                render() {
					let content='<img src onerror="alert(11111111111111111)">'

					return (
						<div>{content}</div>
					);
				}
            }
			ReactDOM.render( < Weather / > , document.getElementById('root'));
		</script>
	</body>
</html>
